<!--重大事故隐患排查表-->
<template>
  <Layout>
    <div v-if="!screenShow">
      <Form ref="form1" :model="dataToQuery" :label-width="120">
          <Row class="query-form">
              <Col span="8">
                  <FormItem label="二级集团：">
                      <two-level-org org-code class="query-form-el" v-model="dataToQuery.twoLevelOrgCode" />
                  </FormItem>
              </Col>
              <Col span="8">
                  <FormItem label="单位名称：" prop="order">
                      <company-select v-model="dataToQuery.companyName" style="width:100%" />
                      <!-- <cascader-dom class="query-form-el" ref='queryOrgCascader' @setOrgname='setQueryOrgName'
                                    :orgTree="true"
                                    :setCurrentName="{label:dataToQuery.companyName,value:dataToQuery.companyId}"></cascader-dom> -->
                  </FormItem>
              </Col>
              <Col span="8" v-if="!switchFlag">
                  <Button @click="switchQuery(true)" class="ivu-btn-switch" type="text">展开∨</Button>
                  <Button @click="reset" class="ivu-btn-reset">重置</Button>
                  <Button type="primary" class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
              </Col>
              <Col span="8" v-else>
                  <FormItem label='考核单元编号：' prop='companyNum'>
                    <Input v-model='dataToQuery.companyNum' class="query-form-el"></Input>
                  </FormItem>
                  <!-- <FormItem label='发生时间：'>
                      <DatePicker class="query-form-el" v-model="dataToQuery.occurrenceTimeRange" format="yyyy-MM-dd" type="daterange" placement="bottom-start" placeholder="请选择查询时间段"
                                  :clearable="false" @on-change="(date) => onSelectFieldQueryDateRange(date, 'occurrenceTime')"></DatePicker>
                  </FormItem> -->
              </Col>
          </Row>
          <Row v-show="switchFlag" class="query-form">

              <Col span="8" offset="16">
                  <Button @click="switchQuery(false)" class="ivu-btn-switch" type="text">收起∧</Button>
                  <Button @click="reset" class="ivu-btn-reset">重置</Button>
                  <Button class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
              </Col>
          </Row>
          <Row class="query-form">
              <Col span="24">
                  <!-- <Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button> -->
                  <!-- <Button type="primary" class="ivu-btn-add" icon="md-cloud-download" @click="exportFormSubmit">导出</Button> -->
              </Col>
          </Row>
      </Form>
      <Table ref='table' :height="tableHeight" no-data-text="没有查询到相关数据!" @on-selection-change='getSelectRows'
             :loading='pageStatus.loading' @on-sort-change="sortChange"
             border :columns="columns1" :data="dataTable">
      </Table>
      <Row style="margin-right:10px;">
          <Col span="24">
              <Page style="float: right" :total="pagedata.total" :page-size="pagedata.pageSize"
                    @on-change="pageChange" @on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray"
                    show-total show-sizer show-elevator/>
          </Col>
      </Row>
    </div>

    <screen-view v-if="screenShow" :id="id" @close="close"></screen-view>

  </Layout>
</template>

<script>
  import {Api} from '@/api/index.js'
  import {formatDate} from '@/tools/index'
  var cascaderDom = () => import('@/components/cascader-dom.vue');
  import pageCommonFunction from '@/components/pageCommonFunction.js'
  import {sessionStorage, cookie} from '@/common/cacheUtils.js';
  import screenView from './screenView.vue';

  export default {
      components: {cascaderDom, screenView},
      data() {
          return {
              ...this.createCommonDataField(),
              imgUrl: "",
              columns1: [
                  {title: '序号', width: 70, fixed: 'left', align: 'center', render: this.indexColumnsRender},
                  { key:'companyName',title: '单位名称',  align: 'center', minWidth: 160, },
                  { key:'companyNum',title: '考核单元编号',  align: 'center', minWidth: 120, tooltip:true },
                  { key:'screenTime',title: '排查时间', sortable: "custom", align: 'center', minWidth: 120,  render: this.renderCellMonth },
                  { key:'screenStatus',title: '排查状态',  align: 'center', minWidth: 120,
                     render: (h, params) => {return h('span', {style: {color: params.row.screenStatus == 0 ?'red': ''}},params.row.screenStatus == 0 ? '未排查' : '已排查')}},
                  // { key:'registrantPhone',title: '填报人手机号',  align: 'center',minWidth: 120, },
                  // this.getActionColumns(),
                  {
                    title: '操作',
                    key: 'action',
                    width: 80,
                    align: 'center',
                    render: (h, params) => {
                      return h('div', [
                        h('Button', {
                          props: {
                            type: 'primary',
                            size: 'small'
                          },
                          style: {
                              fontSize: '12px',
                          },
                          on: {
                            click: () => {
                              this.screenShow = true
                              this.id = params.row.id
                            }
                          }
                        }, '排查')
                      ]);
                    }
                  }
              ],
              ruleCustom: {
                 
              },
              tableHeight: 10,
              dictMap: {},

              // api
              queryUrl: Api.queryAccHazardScreenCompany,
              exportUrl: Api.exportAccHazardScreenCompany,
              deleteUrl: Api.deleteAccHazardScreenCompany,
              // saveUrl: Api.saveNearMissRecord,
              show:true,
              currentUser: JSON.parse(sessionStorage('userId').get('userId')),

              screenShow: false,
              id: ''
          }
      },
      async mounted() {
          this.setTableHeight();
          this.query();
      },
      methods: {
          ...pageCommonFunction,
          deleteData(params) {
              this.deleteDateAjax(params);
          },
          query() {
              this.queryAjax();
          },

          close(flag){
            this.screenShow = false
            this.query()
          },

          // submit(name) {
          //     this.submitAjax(name);
          // },
          // createEmptyDataToAdd() {
          //     return {
          //         createDate: new Date(),
          //         createUserId: this.currentUser.userId,
          //         createUserName: this.currentUser.userName,
          //         id: this.get_uuid(),
          //         idFiles: [],
          //     }
          // },
          async afterDataToViewInit() {
              // await this.getFiles1('id', 'nearMissRecord');
          },
      },
      watch: {},
  }
</script>

<style lang='css' scoped>
  .ivu-form-item {
      padding-right: 20px;
  }

  .query-form-el, .ivu-date-picker, .ivu-input-wrapper {
      width: 100%;
  }

</style>